<template>
  <div class="publish">
  <x-header :left-options="{showBack: true,  backText:''}">发布页</x-header>

      <div class="weui-cells">
            <div class="weui-cell">
                <div class="weui-cell__bd">
                    <input class="weui-input" type="text" placeholder="标题 品类品牌型号都是买家喜欢搜索的">
                </div>
            </div>
      </div>

      <div class="weui-cells weui-cells_form">
            <div class="weui-cell">
                <div class="weui-cell__bd">
                    <textarea class="weui-textarea" placeholder="描述一下你的宝贝" rows="3"></textarea>
                    <div class="weui-textarea-counter"><span>0</span>/200</div>
                </div>
            </div>
      </div>


      <div class="weui-cells weui-cells_form">
            <div class="weui-cell">
                <div class="weui-cell__bd">
                    <div class="weui-uploader">
                        <div class="weui-uploader__hd">
                            <p class="weui-uploader__title">图片上传</p>
                            <div class="weui-uploader__info">0/2</div>
                        </div>
                        <div class="weui-uploader__bd">
                            <ul class="weui-uploader__files" id="uploaderFiles">
                                <li class="weui-uploader__file" style="background-image:url(../assets/pic_160.png)"></li>
                                <li class="weui-uploader__file" style="background-image:url(../assets/pic_160.png)"></li>
                                <li class="weui-uploader__file" style="background-image:url(../assets/pic_160.png)"></li>
                                <li class="weui-uploader__file weui-uploader__file_status" style="background-image:url(../assets/pic_160.png)">
                                    <div class="weui-uploader__file-content">
                                        <i class="weui-icon-warn"></i>
                                    </div>
                                </li>
                                <li class="weui-uploader__file weui-uploader__file_status" style="background-image:url(./images/pic_160.png)">
                                    <div class="weui-uploader__file-content">50%</div>
                                </li>
                            </ul>
                            <div class="weui-uploader__input-box">
                                <input id="uploaderInput" class="weui-uploader__input" type="file" accept="image/*" multiple />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            

            <div class="weui-cell">
                <div class="weui-cell__bd"><span class="iconfont icon-Ge_Dizhi"></span>湖北武汉 江汉区</div>
            </div>

            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">价格(￥)</label></div>
                <div class="weui-cell__bd">
                    <input class="weui-input" type="number" placeholder="请输入您的商品价格">
                </div>
            </div>

        </div>

        <div class="publish-foot">
          <button type="submit">确定发布</button>
        </div>
        
  </div>
</template>

<script>
import { XHeader } from 'vux'
export default {
  name: 'Personlist',
  components: {
    XHeader
  },
  data:function(){
        return {
            
        }
    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.vux-header{
  background-color: #FF4d4d;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 999;
  width: 100%;
}
.vux-header .vux-header-title, .vux-header h1{
  color: #3f3f3f!important;
}
.publish{
  margin-top:4rem;
}
.weui-cells{
  margin-top: -1px;
}
.weui-cell__bd .iconfont{
  margin-right:0.5rem;
}
.publish-foot{
  background-color: #fff;
  width: 100%;
  position: fixed;
  bottom: 0px;
  height: 5.4rem;
  z-index: 1000;
  border-top:1px solid #bababa;
}
.publish-foot button{
  height: 4rem;
  width: 90%;
  margin-top: 0.7rem;
  margin-left: 5%;
  background-color: #fb2b34;
  border: 1px solid #fff;
  color: #fff;
  font-size: 20px;
  outline: none;
}
</style>
